<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>代付款</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@1.6/lib/index.css">
		<!-- 引入组件 -->
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/vant@1.6/lib/vant.min.js"></script>
		<script src="html5plus://ready"></script>
		<script type="text/javascript" src="../../js/fanhui.js" ></script>
		<script src="../../js/ajax.js"></script>
	</head>
	<body>
		<div id="app">
			<header>
				<van-row style="background-color: #FF4444;color: white;">
					<van-col span="10">
						<p @click="left()">
							<van-icon name="arrow-left"/>
						</p>
					</van-col>
					<van-col span="10">
						<p>待付款订单</p>
					</van-col>
				</van-row>
			</header>
			<section>
				<van-row v-for="item in data">
					<div>订单编号<span style="float: right;">{{item.StatusName}}</span></div>
					<div>{{item.Code}}</div>
					<div v-for="val in item.GoodsList">
						<van-card
						  :num="val.BuyCount"
						  :price="val.GoodsPrice"
						  :desc="val.Name"  
						  title=""
						  origin-price="10.00"
						>
							<div slot="thumb">
								<img :src="val.GoodsImageUrl" onerror="this.src='../../img/520.jpg'">
							</div>
						</van-card>
					</div>
					<van-button size="mini" @click="pay(item.Id)" style="float: right; margin-top: 5px; margin-left: 5px;">支付</van-button>
					<van-button size="mini" @click="cancel(item.Id)" style="float: right;margin-top: 5px; ">取消订单</van-button>
				</van-row>
			</section>
			<footer>
				
			</footer>
		</div>
		<script>
			var user=plus.storage.getItem("user");//当前用户
			user=JSON.parse(user);
			console.log(user.Key);
			var vm = new Vue({
				el:"#app",
				data:{
					data:[//订单信息
						
					]
				},
				methods:{
					left(){//点击左边
						plus.webview.close(plus.webview.currentWebview());
					},
					cancel(id){//得到取消订单的商品id
						ajax({
							url:"http://dsapi.ysd3g.com/api/DeleteOrder",
							dataType:'jsonp',
							data:{
								key:user.Key,
								oId:id
							},
							success:function(res)
							{
								if(res.Error){
									vm.$toast(res.Msg);
								}else{
									
									vm.$toast("取消订单成功");
									var slef=plus.webview.currentWebview();
									slef.reload();
								}
							}
						});
					},
					
					pay(id){//获取商品id，进行支付
						console.log(id);
						ajax({ //支付
							url: "http://dsapi.ysd3g.com/api/OrderPay",
							dataType: "jsonp",
							data: {
								key: user.Key, //登陆返回的Key
								oId: id, //订单Id
								payType: '1', //可以写死支付宝
								addressIdx: "", //可为空,收货地址
								money: "0.01" //总价,随意写
							},
							success: function(res) {
								if (res.Error) {
									alert(res.Msg)
								} else {
									var payment = "";
									plus.payment.getChannels(function(s) {
										console.log(s);
										plus.payment.request(s[0], res.strJson, function() {
											vm.$toast.alert("支付操作成功！");
											localStorage.removeItem(orderId);
										},function(e){
											console.log(e);
											_this.$toast.fail(e.message);
										})
									},function(){
										vm.$toast.alert("出现错误，请稍后再试！")
									})
								}
								console.log(res);
							}
						});
					}
				},
				created:function(){
					_this=this;
					ajax({//获取订单编号
						url:"http://dsapi.ysd3g.com/api/MyOrderList",
						dataType:'jsonp',
						data:{
							Key:user.Key
						},
						success:function(res){
							if (res.Error) {
								console.log(res.Msg);
							} else {
								console.log(res);
								_this.data=res.Data;
							}
						}
					});
				}
			})
		</script>
	</body>
</html>
